<template>
  <div class="preview-container">
    {{ data }}
  </div>
</template>

<script>
import { defineComponent, ref } from 'vue';
import { downloadAttach } from '@/api/index.js';
import ExcelJS from 'exceljs';
// 下载pdf包放在本地：https://mozilla.github.io/pdf.js/getting_started/#download
export default defineComponent({
  components: {},
  props: {
    fileId: {
      type: Number,
      default: 0,
    },
    fileType: {
      type: String,
      // doc,docx,pdf,xlsx,
      default: 'docx',
    },
  },
  setup(props) {
    const data = ref(null);
    const loadExcel = async () => {
      await downloadAttach({ id: props.fileId }).then((res) => {
        // 加载excel的数据
        new ExcelJS.Workbook().xlsx.load(res.data).then((workbook) => {
          // 获取excel的第一页的数据
          console.log(workbook);
          const ws = workbook.worksheets[0];
          // 获取每一行的数据
          console.log(ws.actualRowCount);
          console.log(ws.getRows(1, ws.actualRowCount));
          // data.value = ws.getRows(1, ws.actualRowCount);
        });
      });
    };

    loadExcel();

    return {
      data,
    };
  },
});
</script>

<style lang="less" scoped>
.preview-container {
  max-height: 500px;
  overflow-y: scroll;
}
</style>
